tg-lightbox-close

.create-epic-container
    h2.title(translate="EPICS.CREATE.TITLE")
    form(
        ng-submit="vm.createEpic()"
    )
        .subject-container
            .color-selector
                fieldset
                    tg-color-selector(
                        is-color-required="true"
                        init-color="vm.newEpic.color"
                        on-select-color="vm.selectColor(color)"
                    )
            .subject
                fieldset
                    input.e2e-create-epic-subject(
                        type="text"
                        name="subject"
                        ng-model="vm.newEpic.subject"
                        tg-auto-select
                        placeholder="{{'COMMON.FIELDS.SUBJECT' | translate}}"
                        data-required="true"
                        data-maxlength="140"
                    )
        fieldset
            select.e2e-create-epic-status(
                id="epic-status"
                name="status"
                ng-model="vm.newEpic.status"
                ng-options="s.id as s.name for s in vm.project.epic_statuses | orderBy:'order'"
            )
        fieldset.tags-block
            tg-tag-line-common(
                 project="vm.project"
                 tags="vm.newEpic.tags"
                 permissions="add_epic"
                 on-add-tag="vm.addTag(name, color)"
                 on-delete-tag="vm.deleteTag(tag)"
            )
        fieldset
            textarea.e2e-create-epic-description(
                ng-attr-placeholder="{{'EPICS.CREATE.PLACEHOLDER_DESCRIPTION' | translate}}"
                ng-model="vm.newEpic.description"
            )
        fieldset
            tg-attachments-simple(
                attachments="vm.attachments"
                on-add="vm.addAttachment(attachment)"
            )
        .settings
            fieldset.team-requirement
                input(
                    type="checkbox"
                    name="team_requirement"
                    ng-model="vm.newEpic.team_requirement"
                    id="team-requirement"
                )
                label.requirement.trans-button.e2e-create-epic-team-requirement(
                    for="team-requirement"
                    translate="EPICS.CREATE.TEAM_REQUIREMENT"
                )
            fieldset.client-requirement
                input(
                    type="checkbox"
                    name="client_requirement"
                    ng-model="vm.newEpic.client_requirement"
                    id="client-requirement"
                )
                label.requirement.trans-button.e2e-create-epic-client-requirement(
                    for="client-requirement"
                    translate="EPICS.CREATE.CLIENT_REQUIREMENT"
                )
            fieldset
                input(
                    type="checkbox"
                    name="blocked"
                    ng-model="vm.newEpic.is_blocked"
                    id="blocked"
                    ng-click="displayBlockedReason = !displayBlockedReason"
                )
                label.requirement.trans-button.blocked.e2e-create-epic-blocked(
                    for="blocked"
                    translate="EPICS.CREATE.BLOCKED"
                )
        fieldset(ng-if="displayBlockedReason")
            input.e2e-create-epic-blocked-note(
                type="text"
                name="blocked_note"
                maxlength="140"
                ng-model="vm.newEpic.blocked_note"
                placeholder="{{'EPICS.CREATE.BLOCKED_NOTE_PLACEHOLDER' | translate}}"
            )
        fieldset
            button.button-green.button-large.button-block.create-epic-button.e2e-create-epic-button(
                type="submit"
                tg-loading="vm.loading"
                title="{{ 'EPICS.CREATE.CREATE_EPIC' | translate }}"
                translate="EPICS.CREATE.CREATE_EPIC"
            )
